<%@ page contentType="text/html;charset=utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>窝蜂互联网文件服务器</title>

<link href="<%=path %>/uploadify/uploadify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="<%=path %>/uploadify/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="<%=path %>/uploadify/swfobject.js"></script>
<script type="text/javascript" src="<%=path %>/uploadify/jquery.uploadify.v2.1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $('#uploadify').uploadify({
    'uploader'	  		: '<%=path %>/uploadify/uploadify.swf',//是组件自带的flash，用于打开选取本地文件的按钮 
    'script'    		: 'http://image.wooophone.com/upload/uploadify.action',//处理上传的路径，这里使用Struts2是XXX.action 
    'cancelImg' 		: '<%=path %>/uploadify/cancel.png',
    'buttonImg'			: '<%=path %>/uploadify/select.png',//选择文件的按扭图片
    'folder'  		  	: '/test/uploads/image',//上传到服务器目录，格式要求：/项目名/文件夹
    'fileDataName'	 	: 'uploadify',//和input的name属性值保持一致就好，Struts2就能处理了
    'auto'         		: false,//是否选取文件后自动上传
    'multi'   			: true,//是否支持多文件上传
    'simUploadLimit'	: 2,//每次最大上传文件数
    'queueID'        	: 'listed-files', //自定义的显示区域
    'sizeLimit'   		: 100*1024*1024,//最大限制100M
    'displayData'    	: 'speed',//有speed和percentage两种，一个显示速度，一个显示完成百分比 
    'fileDesc'       	: '支持格式:jpg/gif/jpeg/png/bmp/zip/war/ppt/pptx.', //如果配置了以下的'fileExt'属性，那么这个属性是必须的 
    'fileExt'        	: '*.jpg;*.gif;*.jpeg;*.png;*.bmp;*.ppt;*.pptx;*.war;*.zip;*.iso',//允许的格式
    'onComplete'     	: uploadComplete, //上传完成
    "onError"           : uploadFail,//当传错误
  });
});

function showResult(){//删除显示的上传成功结果
   	$("#result").html("");
}
function uploadFile(){//上传文件
   	$('#uploadify').uploadifyUpload();
}
function clearFile(){//清空所有上传队列
	$('#uploadify').uploadifyClearQueue();
}
function upload(){
	$("#file_upload").uploadifyUpload();
}
var uploadComplete = function(event, queueID, fileObj, response, data){
	$("#result").html($("#result").html()+"<p />"+fileObj.name+"---->"+response);
}
var uploadFail = function(event, queueID, fileObj){
	$("#result").html($("#result").html()+"<p />"+fileObj.name+"---->"+"fild");
}
var uploadCancel = function(event, queueID, fileObj){
	$("#result").html($("#result").html()+"<p />"+fileObj.name+"---->"+"cancel");
}

</script>

</head>
<body>
	<h2>窝蜂互联网文件服务器-文件上传测试</h2>
	<div id="listed-files" style="border:solid 1px gray; width:500px; height:300px; overflow: auto;">
	</div>
	<input type="file" id="uploadify" name="uploadify" />
	<div id="result" style="border:solid 1px gray; width:500px; height:100px; overflow: auto;">
	</div>
	<button type="button" onclick="uploadFile()">上传到服务器</button>
</body>
</html>
